/** @format */

@import "@/theme/utils";

.topMv {
  .top {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .right {
    display: flex;
  }
  .list {
    margin-top: 20px;
    .item {
      display: flex;
      margin-bottom: 20px;
      align-items: initial;
      .content {
        width: 300px;
        .name {
          @include ellipsis();
          cursor: pointer;
        }
      }
      .left {
        display: flex;
        flex-direction: column;
        width: 50px;
        align-items: center;
        height: 100%;
        justify-content: center;
        .up {
          color: #b92425;
        }
        .down {
          color: #2e6bb0;
        }
        .number {
          margin-bottom: 8px;

          font-size: 30px;
        }
      }
      .img {
        width: 200px;
        position: relative;
        cursor: pointer;
        height: 110px;
        &:hover {
          .playIcon {
            opacity: 1;
          }
        }
        img {
          width: 100%;
          border-radius: 10px;
        }
        .score {
          position: absolute;
          right: 10px;
          top: 10px;
        }
        .playIcon {
          opacity: 0;
        }
      }
    }
  }
}
